var CanvasManager = function()
{
}

CanvasManager.prototype.start = function(canvas, mode)
{
	this.controller = new Controller(canvas);
	//this.setMode(mode == "new_account" ? InteractionMode.SingleSelect : InteractionMode.MultiSelect);
	
	// Decide what mode to put the sector selector into
	switch(mode)
	{
		case "new_account":
			this.setMode(InteractionMode.SingleSelect);
		break;
		
		case "new_innovation":
			this.setMode(InteractionMode.MultiSelect);
		break;
		
		case "customer_markets":
			this.setMode(InteractionMode.MultiSelectDoubleClickFeature);
		break;
		
	}
	this.controller.init(canvas, this);
	
	this.onLoad();
}

CanvasManager.prototype.init = function()
{
	var controller = this.controller;
	this.addSectorIndustry();
	this.addSectorEnvironmental();
	this.addSectorDigital();
	this.addSectorConsumers();
	//this.addBackButton();
	
	if (this.getMode() == InteractionMode.SingleSelect)
	{		
		controller.disableAllButtons();
	}
	else
	{
		// Set the main sector buttons to be unselectable
		
		this.mainSector_Industry.setSelectable(false);
		this.mainSector_Industry.setHoverable(false);
		this.mainSector_Digital.setSelectable(false);
		this.mainSector_Digital.setHoverable(false);
		this.mainSector_Consumers.setSelectable(false);
		this.mainSector_Consumers.setHoverable(false);
		this.mainSector_Environmental.setSelectable(false);
		this.mainSector_Environmental.setHoverable(false);
	}
	
}


CanvasManager.prototype.getMode = function()
{
	return this.mode;
}

CanvasManager.prototype.setMode = function(mode)
{
	this.mode = mode;
}

CanvasManager.prototype.onMouseClick = function(x, y, element)
{
	var controller = this.controller;
	//var element = controller.getElementAtPos(x, y);
	if (this.getMode() == InteractionMode.SingleSelect)
	{
		if (element != null)
		{
			if (element.getSelectable())
			{
				controller.clearElementsStateSwitch(ElementState.Selected);
				controller.clearSelected();
			
				if (element.getButtonType() == ButtonType.SubSector)
				{
					element.setStateSwitch(ElementState.Selected, true);
					controller.addSelected(element);
					writeData(controller.getSelectedList());
					writeDataNav(controller.getMainSectorId(element.parent));
				}
				else
				{
					var sector = element.getName();
					controller.disableAllButtons();
					controller.enableSection(sector);
				}
			}
		}
	}
	else if (this.getMode() == InteractionMode.MultiSelect)
	{
		if (element != null)
		{
			if (element.getSelectable())
			{
				element.setStateSwitch(ElementState.Selected, !element.getStateSwitch(ElementState.Selected));
				if (element.getStateSwitch(ElementState.Selected))
				{
					controller.addSelected(element);
					writeData(controller.getSelectedList());
				}
				else
				{
					controller.removeSelected(element);
					writeData(controller.getSelectedList());
					
					var list = controller.getSelectedList;
					for(var i=0;i<list.length;i+=1)
					{
						var val = list[i];
						console.log("item:" + val);
					}
				}
			}
		}
	}
	else if (this.getMode() == InteractionMode.MultiSelectDoubleClickFeature)
	{
		if (element != null)
		{
			if (element.getSelectable())
			{
				controller.setLastElement(element);
				
				if (element.getStateSwitch(ElementState.DblClickSelected))
				{
					controller.removeFutureCustomer(element);
					element.setStateSwitch(ElementState.DblClickSelected, false);
					element.setStateSwitch(ElementState.Selected, false);
					
				}
				else if (element.getStateSwitch(ElementState.Selected))
				{
					controller.addFutureCustomer(element);
					controller.removeSelected(element);
					element.setStateSwitch(ElementState.DblClickSelected, true);
					element.setStateSwitch(ElementState.Selected, false);
				}
				else
				{
					controller.addSelected(element);
					element.setStateSwitch(ElementState.DblClickSelected, false);
					element.setStateSwitch(ElementState.Selected, true);
				}
				
				writeData(controller.getSelectedList(true));
				writeFutureCustomerData(controller.getFutureCustomerList(true));
				
			}
		}
	}
}


/* redundant */
CanvasManager.prototype.onMouseDblClick = function(x, y, element)
{
	var controller = this.controller;
	//var element = controller.getElementAtPos(x, y);
	
	if (this.getMode() == InteractionMode.MultiSelectDoubleClickFeature)
	{
		if (element != null)
		{
			if (element.getSelectable())
			{
				// Double clicked
				element.setStateSwitch(ElementState.DblClickSelected, true);
				//element.setStateSwitch(ElementState.Selected, false);
				
				if (element.getStateSwitch(ElementState.Selected))
				{
					element.setStateSwitch(ElementState.Selected, false);
					controller.removeSelected(element);
					writeData(controller.getSelectedList());
					//writeDataNav(controller.getMainSectorId(element.parent));
				}
			
				controller.addFutureCustomer(element);
				writeFutureCustomerData(controller.getFutureCustomerList());
			}
		}
	}
}
CanvasManager.prototype.step = function(x, y)
{
	var controller = this.controller;
	var element = controller.getElementAtPos(x, y);
	
	controller.clearElementsStateSwitch(ElementState.Hover);
	
	if (element != null)
	{
		if (element.getHoverable() == true)
		{
			element.setStateSwitch(ElementState.Hover, true);
		}
	}
}

CanvasManager.prototype.onLoad = function()
{
	var controller = this.controller;
	var subSectionStr = null;
	var mainSectionStr = null;
	var array = null;
	
	if (this.getMode() == InteractionMode.MultiSelect)
	{
		subSectionStr = getData();
		mainSectionStr = getDataNav();
		array = subSectionStr.split(',');
		
		if (array[0] != "")
		{
			for(var i=0;i<array.length; i+=1)
			{
				var val = array[i];
				if (val != null)
				{
					if (val != "")
					{
						var element = controller.getElementById(parseInt(val));
						controller.addSelected(element);
						element.setStateSwitch(ElementState.Selected, true);
					}
				}
			}
		}
	}
	else if (this.getMode() == InteractionMode.SingleSelect)
	{
		subSectionStr = getData();
		mainSectionStr = getDataNav();
		array = subSectionStr.split(',');
		
		
		var mainSectionName = controller.getMainSectorById(parseInt(mainSectionStr));
		//var mainSectionElement = controller.getMainElementByName(mainSectionName);
		controller.enableSection(mainSectionName);
		
		for(var i=0;i<array.length; i+=1)
		{
			var val = array[i];
			if (val != null)
			{
				if (val != "")
				{
					var element = controller.getElementById(parseInt(val));
					controller.addSelected(element);
					element.setStateSwitch(ElementState.Selected, true);
				}
			}
		}
	}
	else if (this.getMode() == InteractionMode.MultiSelectDoubleClickFeature)
	{
		currentMarkets = getData();
		futureMarkets = getFutureCustomerData();
		arrayCurrent = currentMarkets.split(',');
		arrayFuture = futureMarkets.split(',');

		// Set all the current customer target markets
		if (arrayCurrent[0] != "")
		{
			for(var i=0;i<arrayCurrent.length; i+=1)
			{
				var val = arrayCurrent[i];
				if (val != null)
				{
					if (val != "")
					{
						var element = controller.getElementById(parseInt(val));
						controller.addSelected(element);
						element.setStateSwitch(ElementState.Selected, true);
					}
				}
			}
		}
		
		// Set all the future customer target markets
		if (arrayFuture[0] != "")
		{
			for(var i=0;i<arrayFuture.length; i+=1)
			{
				var val = arrayFuture[i];
				if (val != null)
				{
					if (val != "")
					{
						var element = controller.getElementById(parseInt(val));
						controller.addFutureCustomer(element);
						element.setStateSwitch(ElementState.DblClickSelected, true);
					}
				}
			}
		}
		
		// For consistency reasons we now write the data again back to the hidden input
		writeData(controller.getSelectedList());
		writeFutureCustomerData(controller.getFutureCustomerList());
	}
	//writeData(controller.getSelectedList());
}

CanvasManager.prototype.addSectorIndustry = function()
{
	var controller = this.controller;

	// Background rectangle
	var attributes = BackgroundRectangleAttributes;
	
	var rect = controller.addRectangle(0,0,attributes.width,attributes.height, attributes.redColor, attributes.redColor, attributes.redColor);
	//rect.setEnabled(false);
	rect.setZ(1);
	rect.setBorderRadius(15);
	rect.setBorderColor(Color.None);
	rect.setEnabled(false);
	rect.setDisabledColor(attributes.redColor);
	
	
	// Button
	var attributes = MainSectorAttributes;
	
	var rect = controller.addRectangle(179,121,attributes.width,attributes.height, MainSectorAttributes.redColor, MainSectorAttributes.lredColor, MainSectorAttributes.dredColor);
	rect.setZ(5);
	rect.setBorderRadius(15);
	rect.setName("industry");
	rect.setButtonType(ButtonType.MainSector);
	rect.setId(4);
	

	var image = controller.addImage(179+16,121+24, '../../resources/images/canvasassets/industry.png');
	image.setZ(10);
	
	this.mainSector_Industry = rect;
	/*
	var label = controller.addLabel(179,130, attributes.width,attributes.height, Color.Yellow, "INDUSTRY");
	label.setZ(5);
	label.setFontSize(attributes.fontsize);
	label.setLineHeight(18);
	label.setStyle(attributes.style);
	*/
	//label.setVAlign(TextAlignment.Middle);

	this.addSubSectorIndustry();
}

CanvasManager.prototype.addSectorEnvironmental = function()
{
	var controller = this.controller;
	
	// Background rectangle
	var attributes = BackgroundRectangleAttributes;
	
	var rect = controller.addRectangle(388,0,attributes.width,attributes.height, attributes.yellowColor, attributes.yellowColor, attributes.yellowColor);
	//rect.setEnabled(false);
	rect.setZ(1);
	rect.setBorderRadius(15);
	rect.setBorderColor(Color.None);
	rect.setEnabled(false);
	rect.setDisabledColor(attributes.yellowColor);
	// Button
	var attributes = MainSectorAttributes;
	
	var rect = controller.addRectangle(391,121,attributes.width,attributes.height, MainSectorAttributes.yellowColor, MainSectorAttributes.lyellowColor, MainSectorAttributes.dyellowColor);
	rect.setButtonType(ButtonType.MainSector);
	rect.setId(1);
	rect.setName("environmental");
	
	this.mainSector_Environmental = rect;
	
	rect.setZ(5);
	rect.setBorderRadius(15);
	
	var image = controller.addImage(391+16,121+24, '../../resources/images/canvasassets/environmental_and_health.png');
	image.setZ(10);
	
	/*
	var label = controller.addLabel(391,121, attributes.width,attributes.height, Color.Grey, "ENVIRONMENTAL |& HEALTH");
	
	
	//circle.setZ(6);
	label.setZ(5);
	
	label.setFontSize(attributes.fontsize);
	label.setLineHeight(18);
	label.setStyle(attributes.style);
	*/
	
	this.addSubSectorEnvironmental();
}

CanvasManager.prototype.addSectorDigital = function()
{
	var controller = this.controller;

	// Background rectangle
	var attributes = BackgroundRectangleAttributes;
	
	var rect = controller.addRectangle(0,219,attributes.width,attributes.height, attributes.grayColor, attributes.grayColor, attributes.grayColor);
	//rect.setEnabled(false);
	rect.setZ(1);
	rect.setBorderRadius(15);
	rect.setBorderColor(Color.None);
	rect.setEnabled(false);
	rect.setDisabledColor(attributes.grayColor);
	// Button

	var attributes = MainSectorAttributes;
	var rect = controller.addRectangle(179,223,attributes.width,attributes.height, MainSectorAttributes.grayColor, MainSectorAttributes.lgrayColor, MainSectorAttributes.dgrayColor);
	
	rect.setButtonType(ButtonType.MainSector);
	rect.setId(3);
	rect.setName("digital");
	rect.setZ(5);
	//circle.setZ(6);
	
	
	this.mainSector_Digital = rect;
	var image = controller.addImage(179+16,223+24, '../../resources/images/canvasassets/digital_and_financial.png');
	image.setZ(10);
	/*
	var label = controller.addLabel(179,223, attributes.width,attributes.height, Color.Yellow, "DIGITAL |& FINANCIAL");
	label.setZ(5);
	label.setFontSize(attributes.fontsize);
	label.setLineHeight(18);
	label.setStyle(attributes.style);
	
	*/
	rect.setBorderRadius(15);
	this.addSubSectorDigital();
}

CanvasManager.prototype.addSectorConsumers = function()
{
	var controller = this.controller;
	
	// Background rectangle
	var attributes = BackgroundRectangleAttributes;
	
	var rect = controller.addRectangle(388,219,attributes.width,attributes.height, attributes.blueColor, attributes.blueColor, attributes.blueColor);
	//rect.setEnabled(false);
	rect.setZ(1);
	rect.setBorderRadius(15);
	rect.setBorderColor(Color.None);
	rect.setEnabled(false);
	rect.setDisabledColor(attributes.blueColor);
	// button
	var attributes = MainSectorAttributes;
	
	var rect = controller.addRectangle(391,223,attributes.width,attributes.height, MainSectorAttributes.blueColor, MainSectorAttributes.lblueColor, MainSectorAttributes.dblueColor);
	
	rect.setButtonType(ButtonType.MainSector);
	rect.setId(2);
	rect.setName("consumers");
	rect.setZ(5);
	//circle.setZ(6);
	
	this.mainSector_Consumers = rect;
	
	
	var image = controller.addImage(391+16, 223+24, '../../resources/images/canvasassets/consumers_and_society.png');
	image.setZ(10);
	
	/*
	var label = controller.addLabel(391,223, attributes.width,attributes.height, Color.Grey, "CONSUMERS & |SOCIETY");
	label.setZ(5)
	label.setFontSize(attributes.fontsize);
	label.setStyle(attributes.style);
	label.setLineHeight(18);
	*/
	
	rect.setBorderRadius(15);
	
	this.addSubSectorConsumers();
}

CanvasManager.prototype.addBackButton = function()
{
	var controller = this.controller;
	var attributes = BackButtonAttributes;

	var circle = controller.addCircle(388, 219, 32, attributes.Color, attributes.hoverColor, attributes.Color);
	var label = controller.addLabel(388-32, 219-18, 64, 64, Color.Black, "BACK");
	label.setVAlign(TextAlignment.Middle);
	label.setHAlign(TextAlignment.Center);
	circle.setSelectable(false);
	circle.setZ(10);
	label.setZ(11);
	label.setFontSize("17");
	
	this.backButton = circle;
}

CanvasManager.prototype.addSubSector = function(sector, tx, ty)
{
	var controller = this.controller;
	var attributes = SubSectorAttributes;
	var x = sector.x;
	var y = sector.y;
	var text = sector.text;
	var id = sector.id;
	var parent = sector.parent;
	
	var rect = controller.addRectangle(sector.x-14,sector.y,140,attributes.height, attributes.bgColor_Unselected, attributes.bgColor_Hover, attributes.bgColor_Selected);
	rect.setZ(10);
	rect.setBorderRadius(15);
	rect.setBorderColor(Color.Black);
	rect.setId(id);
	rect.setParent(parent);
	rect.setName(text);
	rect.setButtonType(ButtonType.SubSector);
	rect.setDisabledColor(attributes.disabledColor);
	rect.setDoubleClickColor(attributes.bgColor_DblClickSelected);
	
	var txo, tyo;
	
	txo = sector.labelXOffset;
	tyo = sector.labelYOffset;
	if (txo == undefined)txo = 0;
	if (tyo == undefined)tyo = 0;
	var label = controller.addLabel(x-14 + txo ,y + tyo ,attributes.width,attributes.height, attributes.textColor,text);
	//label.setHAlign(TextAlignment.Left);
	//label.setVAlign(TextAlignment.Top);
	label.setRecalc();
	label.setZ(11);
	//label.setColor(Color.Black);
	label.setFontSize(attributes.fontsize);
	label.setStyle(attributes.style);
	label.setFont(attributes.font);
	
	controller.addSubSectorButton(rect);
}

CanvasManager.prototype.addSubSectorIndustry = function()
{
	var controller = this.controller;
	var attributes = SubSectorAttributes;
	var subSector = SubSector.Industry;

	this.addSubSector(subSector.MaterialsAndEngineering, 17,-1);
	this.addSubSector(subSector.IndustrialChemicalAndMineral, 3,-1);
	this.addSubSector(subSector.AutomotiveAndTransport, 17,-1);
	this.addSubSector(subSector.AerospaceDefenceAndSecurity, 6,-1);
	this.addSubSector(subSector.ConstructionAndBuiltEnvironment, 1,-1);
}

CanvasManager.prototype.addSubSectorDigital = function()
{
	var controller = this.controller;
	var attributes = SubSectorAttributes;
	var subSector = SubSector.Digital;

	this.addSubSector(subSector.ElectronicsAndHardware, 17,0);
	this.addSubSector(subSector.Software, 32,10);
	this.addSubSector(subSector.CreativeAndMedia, 14,10);
	this.addSubSector(subSector.Communications, 15,10);
	this.addSubSector(subSector.FinancialServices, 10,10);	
	this.addSubSector(subSector.BusinessToBusinessServices, 2,0);	
}


CanvasManager.prototype.addSubSectorEnvironmental = function()
{
	var controller = this.controller;
	var attributes = SubSectorAttributes;
	var subSector = SubSector.Environmental;

	this.addSubSector(subSector.InfrastructureAndUtilities, 17,0);
	this.addSubSector(subSector.EnvironmentalTechnology, 17,0);
	this.addSubSector(subSector.BiotechAndPharma, 13,10);
	this.addSubSector(subSector.HealthcareAndMedical, 3,10);
	this.addSubSector(subSector.PublicAdministrationAndEducation, 3,0);	
}

CanvasManager.prototype.addSubSectorConsumers = function()
{
	var controller = this.controller;
	var attributes = SubSectorAttributes;
	var subSector = SubSector.Consumers;

	this.addSubSector(subSector.FoodAndDrink, 25,10);
	this.addSubSector(subSector.HousingClothingAndTextiles, 3,0);
	this.addSubSector(subSector.LeisureAndLifestyle, 10,10);
	this.addSubSector(subSector.LandAndProperty, 16,10);
}